import React, { Component } from "react";

// const obj = { color: "red" };

// const color = "red";

/*
  在jsx里面，不管是文本还是属性，都用一个大括号包住
  添加样式的时候，类组件和函数组件是没有区别的

  style要用两个大括号
  多个属性用逗号隔开
  如果有连字符，需要换成对应的小驼峰

  如果属性值是数字，会自动加上px单位
*/

class App extends Component {
  state = {};
  render() {
    return (
      <>
        <h2>通过style的方式来添加样式</h2>
        {/* <div style={{ color: "red", fontSize: "30px" }}>hello react!</div> */}
        <div style={{ color: "red", fontSize: 30, lineHeight: 30 }}>
          hello react!
        </div>
      </>
    );
  }
}

export default App;
